<!--@thymesVar id="user" type="ru.tbcarus.spendingsb.model.User"-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
<!--    <meta name="viewport" content="width=device-width, initial-scale=1">-->
    <title th:text="${user.name}">ПОЛЬЗОВАТЕЛЬ</title>
    <div th:replace="~{fragments/headTag :: headTag}"></div>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
        crossorigin="anonymous"></script>
<nav th:replace="~{fragments/bodyHeader :: bodyHeader}"></nav>

<div style="width: 400px" class="position-absolute top-50 start-50 translate-middle">
    <form th:method="post" th:action="@{/payments/profile}">
        <input type="hidden" name="id" th:value="${user.id}">
        <table class="table table-striped shadow">
            <tr>
                <td style="vertical-align: middle; text-align: right">
                    <b>Имя:</b>
                </td>
                <td>
                    <input type="text" name="name" th:value="${user.name}" style="width: 150px"
                           class="rounded-2 border-1">
                </td>
            </tr>
            <tr>
                <td style="vertical-align: middle; text-align: right">
                    <b>Начальный день месяца:</b>
                </td>
                <td>
                    <select name="start_day" class="rounded-2 border-1">
                        <option th:value="${user.startPeriodDate.dayOfMonth}" selected
                                hidden th:text="${user.startPeriodDate.dayOfMonth}">SELECTED
                        </option>
                        <option th:each="i : ${#numbers.sequence(1,28,1)}" th:value="${i}" th:text="${i}">DAY</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td style="vertical-align: middle; text-align: right">
                    <b>Старый пароль:</b>
                </td>
                <td>
                    <input type="password" name="old_pass" style="width: 150px" class="rounded-2 border-1">
                </td>
            </tr>
            <tr>
                <td style="vertical-align: middle; text-align: right">
                    <b>Новый пароль:</b>
                </td>
                <td>
                    <input type="password" name="new_pass" style="width: 150px" class="rounded-2 border-1">
                </td>
            </tr>
            <tr>
                <td style="vertical-align: middle; text-align: right">
                    <b>Повторить пароль:</b>
                </td>
                <td>
                    <input type="password" name="new_pass_reply" style="width: 150px" class="rounded-2 border-1">
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <div class="d-flex justify-content-around">
                        <button type="submit" class="btn btn-top">Сохранить</button>
                        <input type="button" class="btn btn-top" value="На главную"
                               th:onclick="|window.location.href = '@{/payments}'|">
                    </div>
                </td>
            </tr>
        </table>
    </form>
    <!--    copyright-->
    <div th:replace="~{fragments/footer :: copy}"></div>
</div>
</body>
</html>